import {Row,Col} from 'react';
function Detail(props){

    const data = props.data ? props.data : [];
    let columnWidth = "50%"
    if(props.column){
        columnWidth = 100/props.column + "%"
    }
    return(
        <div style={{display:"flex",flexWrap: "wrap",margin:0,padding:0}}>

          
            {
                data.map(item => 
                    <dl key={item.key} style={{flex:"0 0 50%",display:"flex"}}>
                        <dt style={{flex:"0 0 auto",textAlign:"right",padding:"0px 8px 0px 16px",margin:0,borderLeft:"3px solid rgb(52, 152, 219)"}}>{item.key} : </dt>
                        <dd style={{flex:"1 1 auto",padding:"0px 0px 0px 8px",margin:0}}>{' '} {item.value} </dd>
                    </dl>
                )
            }
        </div>
    )

}

export default Detail;